<template>
    <div>
        <div class="i-layout-page-header">
            <PageHeader title="审核表单" hidden-breadcrumb/>
        </div>
        <Card :bordered="false" dis-hover class="ivu-mt">
            <Row>
                <Col :xl="{span: 12, offset: 6}" :lg="{span: 12, offset: 6}" :md="{span: 16, offset: 4}"
                     :sm="{span: 20, offset: 2}" :xs="24">
                    <Steps :current="currentStep">
                        <Step title="确认信息"></Step>
                        <Step title="填写审核人"></Step>
                        <Step title="完成"></Step>
                    </Steps>
                    <!--第一步-->
                    <template v-if="this.currentStep ==0">
                        <DescriptionList :col="1">
                            <Description term="申请人姓名">data.users[0].nickName}</Description>
                            <Description term="申请人电话：">{{data.users[0].phonenumber}}</Description>
                            <Description term="物品名称：">{{data.adtrtName}}</Description>
                            <Description term="物品用途：">{{data.adtrtReson}}</Description>
                            <Description term="数量：">{{data.adtrtCount}}</Description>
                            <Description term="领用时间：">{{data.startTime}}</Description>
                        </DescriptionList>
                        <Button type="primary" @click=handleSetStep(1)>下一步</Button>
                    </template>
                    <!--第二步-->
                    <template v-if="this.currentStep ==1">
                        <Form ref="form" :model="auditData" :rules="rules" :label-width="labelWidth"
                              :label-position="labelPosition">
                            <div style="margin-top: 5%">
                                <FormItem label="审核人：" prop="auditMen">
                                    <Input v-model="auditData.auditMen"/>
                                </FormItem>
                                <FormItem label="审核意见：" prop="auditAdvice">
                                    <!--审核意见(1:同意，2：拒绝）-->
                                        <Select v-model="auditData.auditAdvice" placeholder="请选择审核意见" element-id="auditAdvice">
                                            <Option value="1">同意</Option>
                                            <Option value="2">拒绝</Option>
                                        </Select>
                                </FormItem>
                                <FormItem label="审批批准数量：">
                                    <Input v-model="auditData.passCount" />
                                </FormItem>
                                <FormItem label="审批备注：" prop="auditRemark">
                                    <Input type="textarea" :rows="4"  v-model="auditData.auditRemark" />
                                </FormItem>
                                <FormItem>
                                    <Button type="primary" @click=handleSetStep2(2)>下一步</Button>
                                </FormItem>
                            </div>
                        </Form>
                    </template>
                    <!--第三步-->
                    <template v-if="this.currentStep ==2">
                        <Result type="success" title="审核成功" desc="您可以返回列表查看">
                            <div slot="extra">
                                <Form ref="form" :label-width="labelWidth" :label-position="labelPosition">
                                    <FormItem label="审核人：">
                                        {{ auditData.auditMen }}
                                    </FormItem>
                                    <FormItem label="审批数量：">
                                        {{ auditData.passCount }}
                                    </FormItem>
                                    <FormItem label="备注：">
                                        {{ auditData.auditRemark }}
                                    </FormItem>
                                </Form>
                            </div>
                            <div class="ivu-text-center" slot="actions">
                                <Button @click="goBackList">返回列表</Button>
                            </div>
                        </Result>

                    </template>

                </Col>
            </Row>
        </Card>

    </div>
</template>

<script>
    import Administrative from "@/api/Administrative";
    export default {
        data() {
            return {
                currentStep: 0,
                data:'',
                auditData:{
                    auditMen: '',
                    auditAdvice: '',
                    passCount: '',
                    auditRemark: '',
                },
                infoData: {
                    user: '小军',
                    account: '2',
                    remark: '同意领用',
                },
                rules: {
                    auditMen: [
                        {required: true, message: '请填写审核人', trigger: 'change'}
                    ],
                    auditAdvice: [
                        {required: true, message: '审核意见', trigger: 'change'}
                    ],
                    auditRemark: [
                        {required: true, message: '请填写备注', trigger: 'blur'}
                    ],
                }
            }
        },
        created() {
            this.getDtail();
        },
        methods: {
            getDtail(){
                Administrative.getInfoById({
                    adtrtId:this.$route.query.adtrtId
                })
                    .then(res => {
                        // 返回数据
                        this.data = res;

                    })
                    .catch(err => {
                        // 异常情况
                    })
            },
            handleSetStep2(current) {
                this.$refs.form.validate((valid) => {
                    if (valid) {
                        this.$Modal.confirm({
                            title: '提交',
                            content: '确认提交审核么？',
                            onOk: () => {
                                /*审核*/
                                Administrative.insertAuditInfo({
                                    adtrtId:this.$route.query.adtrtId,
                                    auditMen: this.auditData.auditMen,
                                    auditAdvice: this.auditData.auditAdvice,
                                    passCount: this.auditData.passCount,
                                    auditRemark: this.auditData.auditRemark,
                                    lsStatus:this.data.status

                                })
                                    .then(res => {
                                        // 返回数据
                                        this.$Message.success('审核成功');
                                        this.currentStep = current;
                                    })
                                    .catch(err => {
                                        // 异常情况
                                    })
                            }
                        });




                    }
                });
            },
            handleSetStep(current, data) {
                this.currentStep = current;
                // if (data) this.data = Object.assign(this.data, data);
            },
            goBackList(){
                this.$router.push('/administrative/goods')
            }
        }
    }
</script>

<style scoped>

</style>
